<template>
<div class="box">
   
    <div class="top" ><h1>{{user.securityNoticeNo }}</h1> 
    <p><span>{{user.updateTime }}更新</span> </p>
    <p><span>{{ user.announcementTime }}发布</span></p>
    </div>
    <div class="mid"> <h1>概述</h1>
    <h2>简介<br>
        <span>{{ user.summary }}</span></h2>
    <br>
        <h2>严重级别<br>
        <span>{{ user.type }}</span></h2>
<br>
<h2>主题<br>
        <span>{{ user.introduction }}</span></h2>
        <br>
<h2>描述<br>
        <span>{{ user.description }}</span></h2>
        <br>
        <h2>影响组件<br>
        <span>{{ user.affectedComponent }}</span></h2>
        <br>
        <h2>cve<br>
        <span>{{ user.cveId }}</span></h2><br>
        <h2>参考<br>
        <span>{{ user.url }}</span></h2>
    </div>
    
    <div class="low"><h1> 更新的软件包</h1><br>
        <h2>src:<br>
        <span>{{ user.src }}</span></h2>
    <br>
        <h2>aarch64:<br>
        <span>{{ user.aarch64 }}</span></h2>
        <h2>x86_64:<br>
        <span>{{ user.x86_64 }}</span></h2>
        <h2>noarch:<br>
        <span>{{ user.noarch }}</span></h2></div>
        
       
        
</div>
</template>
<script setup>
import { ref, onMounted,computed} from 'vue';
import { useRouter ,useRoute} from 'vue-router';
import {noticesDetail} from '@/utils/api.js'
import router from '@/router';
const route = useRoute();

onMounted(() => {
    let row=route.query.row
    if(route.path==="/notice"){
    clickadd(row)
    }
    });


const user = ref({
    securityNoticeNo:'',
    updateTime: '',
    announcementTime: '',
    affectedComponent:'',
    affectedProduct:'',
    cveId:'',
    description:'',
    introduction:'',
    noarch:'',
    src:'',
    summary:'',
    type:'',
    url:'',
    aarch64:'',
    x86_64:'',
});
// const securityNoticeNo=ref('')
// const updateTime=ref('')
// const announcementTime=ref('')
const clickadd= (row) =>{
    noticesDetail(row).then((res)=>{
        user.value=res.data
    })
}
    
 

</script>
<style scoped lang="less" >
.box {
    height: 100%;
    .top{
    padding: 24px 40px;
    width: 100%;
    height: 200px;
    background-color: #dbddde;
    }
    .mid{
        padding: 24px 40px;
    margin-top: 16px;
    width: 100%;
    height: 100%;
    background-color: #dbddde;
    }
    .low{
    padding: 24px 40px;
    margin-top: 16px;
    width: 100%;
    height: 100%;
    background-color: #dbddde;
    }
}
</style>